{extend name="$admin_layout" /}
{block name="content"}

    <style>
        #app {
            padding: 20px;
            background-color: #f8f8f8;
        }

        #page {
            background-color: #fff;
            padding: 20px;
        }

        .table-title {
            height: 50px;
            line-height: 50px;
            border-bottom: 1px solid #ececec;
        }

        .table-title-icon {
            display: inline-block;
            width: 4px;
            height: 50%;
            background-color: #4caef3;
            vertical-align: middle;
            border-radius: 3px;
        }

        .table-title-text {
            font-size: 14px;
            margin-left: 10px;
        }

        .padding-tb {
            padding-top: 20px;
            padding-bottom: 20px;
        }

        .flex-center {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }

        .text-center {
            text-align: center;
        }

        .table {
            text-align: center;
        }

        .table tr th {
            text-align: center;
        }

        .table tr td {
            color: #999;
        }

        .margin-tb {
            margin-top: 10px;
            margin-bottom: 10px;
        }

        .progress-wrap {
            height: 100px;
            display: flex;
        }

        .progress-wrap>div {
            flex: 1;

        }

        .progress-wrap .len {
            width: 100%;
            height: 30px;
            background-color: #ececec;
            text-align: center;
            line-height: 30px;
            color: #666666;
            font-size: 12px;
        }

        .progress-wrap>div:first-child .len {
            border-radius: 30px 0 0 30px;
        }

        .progress-wrap>div:last-child .len {
            border-radius: 0 30px 30px 0;
        }

        .progress-wrap .len.ok {
            background-color: #4caef3;
            color: white;
        }

        .progress-wrap .tit {
            text-align: center;
            line-height: 50px;
            color: #777777;
            font-size: 12px;
        }
    </style>
	<div id="app">
    <div id="page">
	  
        <div class="progress-wrap">
            <div>
                <div class="len ok">下单</div>
                <div class="tit">{$order_info.create_time|date="Y-m-d H:i:s"}</div>
            </div>		
			<div>
				<div class="len {if condition="$order_info['status'] >= 1"}ok{/if}">付款</div>
				<div class="tit">{if condition="$order_info['status'] >= 1"}{$order_info.pay_time|format_time}{/if}</div>
			</div>	          
			
            <div>
                <div class="len {if condition="$order_info['status'] >= 2"}ok{/if}">发货</div>
                <div class="tit">{if condition="$order_info['status'] >= 2"}{$order_info.order_express.shipping_time|format_time}{/if}</div>
            </div>
            <div>
                <div class="len {if condition="$order_info['status'] >= 3"}ok{/if}">收货</div>
                <div class="tit">{if condition="$order_info['status'] >= 3"}{$order_info.order_express.receive_time|format_time}{/if}</div>
            </div>
            <div>
                <div class="len {if condition="$order_info['status'] == 4"}ok{/if}">完成</div>
                <div class="tit">{if condition="$order_info['status'] == 4"}{$order_info.comment_time|format_time}{/if}</div>
            </div>
        </div>
        <div>
            <div class="table-title">
                <span class="table-title-icon"></span>
                <span class="table-title-text">基本信息</span>
            </div>
            <div class="padding-tb">
                <table class="table table-bordered">
                    <tbody>
                        <tr>
                            <th style="width: 150px;">订单号</th>
                            <th>商品金额</th>
							<th>运费</th>
						    <th>订单金额</th>
							<th>优惠金额</th>
				
							<th>应付金额</th>							  							
                            <th style="width: 160px">交易状态</th>
                        </tr>
                        <tr>
                            <td>{$order_info.order_sn}</td>
                            <td>￥{:bcsub($order_info.order_money,$order_info.order_info.express_price,2)}</td>
							<td>+￥{$order_info.order_info.express_price}</td>
						    <td>=￥{$order_info.order_money}</td>
					        <td>
                                <div class="margin-tb">
                                    - {$order_info.coupon_money}
                                    <span class="label label-info">优惠券</span> 	
                                </div>	
                                <div class="margin-tb">
                                   {$order_info.edit_money >= 0 ? '+' : ''} {$order_info.edit_money}
                                   <span class="label label-danger">改价</span>
                                </div>                            
							</td>
				
                            <td>
							   = ￥{$order_info.payable_money}
							   {eq name="$order_info.status" value="0"}
								  {eq name="$order_info.pay_status" value="0"}
									{elt name="$order_info.edit_money" value="0"}
									<a href="javascript:edit_money('{$order_info.order_sn}');" >修改金额</a>
									 {/elt}   	
								  {/eq}   
								{/eq}  							  
							</td>                      
                       
                            <td>
                                <div class="margin-tb">付款状态:
								{if condition="$order_info['pay_status'] == 1"}
                                <span class="label label-success">已付款</span>
								{elseif condition="$order_info['pay_status'] == 0"}
								<span class="label label-danger">未付款</span>
								{/if}
								</div>
                                <div class="margin-tb">发货状态: 
								{if condition="$order_info['order_express'][0]['shipping_time'] > 0"}
								<span class="label label-success">已发货</span>
								{else/}
								<span class="label label-danger">未发货</span>
								{/if}
								</div>
							   <div class="margin-tb">收货状态:
								{if condition="$order_info['receive_time'] > 0"} 
								 <span class="label label-success">已收货</span>
								{else/}
								 <span class="label label-danger">未收货</span>
								{/if}
								</div>
                                <div class="margin-tb">结算状态:
								{if condition="$order_info['settle_status'] == 1"} 
								 <span class="label label-success">已结算</span>
								{else/}
								 <span class="label label-danger">未结算</span>
								{/if}
								</div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
		
			{if condition="$order_info['status'] >=1"}
			<div class="table-title">
                <span class="table-title-icon"></span>
                <span class="table-title-text">付款信息</span>
            </div>
            <div class="padding-tb">
                <table class="table table-bordered">
                    <tbody>
                        <tr>
                            <th style="width: 150px">应付款金额</th>
                            <th>支付方式</th>
                            <th>支付流水号</th>
                            <th style="width: 100px">付款状态</th>
                            <th style="width: 180px">付款时间</th>				
                        </tr>
                        <tr>
                            <td>¥ {$order_info.payable_money}</td>
                            <td>
							   <span class="label label-flat label-success"> {$order_info.pay_type_name} </span>
							</td>
                            <td>{$order_info.transaction_id}</td>
                            <td>
							    {if condition="$order_info['pay_status'] >= 1"}
                                <span class="label label-success">已付款</span>
								{elseif condition="$order_info['pay_status'] == 0"}
								<span class="label label-success">未付款</span>
								{/if}
                            </td>

                            <td>{$order_info.pay_time|format_time}</td>
						 </tr>
						{if condition="$order_info.order_type ==7 "}
						<tr>
                            <td>¥ {$order_info.final_order.payable_money}</td>
                            <td>
							    {if condition="$order_info.final_order.pay_type eq 'alipay'"}支付宝
								{elseif condition="$order_info.final_order.pay_type eq 'wxpay'"/}微信支付
								{/if}
							</td>
                            <td>{$order_info.final_order.transaction_id}</td>
                            <td>
							    {if condition="$order_info['final_order']['pay_status'] == 1"}
                                <span class="label label-success">已付款</span>
								{elseif condition="$order_info['final_order']['pay_status'] == 0"}
								<span class="label label-success">未付款</span>
								{/if}
                            </td>

                            <td>{$order_info.pay_time|date="Y-m-d H:i:s"}</td>
							<td><a title="点击验证" href="javascript:void(0);" onclick="query_order('{$order_info.order_sn}')" class="btn btn-xs mr5 btn-default btn-flat"><i class="fa fa-check pr5"></i>点击验证</a></td>
                        </tr>
						{/if}
                    </tbody>
                </table>
            </div>
			{/if}
            <div class="table-title">
                <span class="table-title-icon"></span>
                <span class="table-title-text">商品信息</span>
            </div>
            <div class="padding-tb">
			 
                <table class="table table-bordered">
                    <tbody>
                        <tr>
						    <th width="50px">子订单ID</th>
						    <th width="50px">图片</th>
                            <th  style="text-align:left">商品名称</th>                     
							<th style="width: 100px">成本价</th>	
							<th style="width: 100px">本店价</th>							
                         
                            <th style="width: 100px">购买数量</th>
                            <th style="width: 100px">商品总价</th>
						
					
					        <th style="width: 100px">售后退款</th>
						    <th style="width: 100px">售后申请</th>
                        </tr>
						{volist name="$order_info.order_goods" id="g"}
                        <tr>
						    <td>{$g.id}</td>  
						    <td>
								<a data-magnify="gallery{$g.goods_id}" data-caption="{$g.goods_id}" href="{$g.goods_thumb|get_file_url}">
								   <img data-original="{$g.goods_id}" src="{$g.goods_thumb|get_file_url}" alt="" style="width:25px;height:25px;" />
								</a>
                            </td>
                            <td style="text-align:left">
								<div>
									<div>
									  {gt name="$g.activity_id" value="0"}<span class="label label-success">活动</span>{/gt}
									  {$g.goods_name}
									</div>
									<div style="color:#999"> {$g.sku_name}</div>
								</div>
								{notempty name="$g.comment"}
								<div  style="color:#ff0000;margin-top:5px;"> 
								  买家点评： {$g.comment.content}								
								</div>
								{/notempty}
							</td>                           
							<td>¥ {$g.cost_price}</td>
							<td>¥ {$g.shop_price}</td>	
                            <td>x {$g.num}</td>
                            <td><span class="text-danger"><b>¥ {$g.goods_money}</b></span></td>
							<td>¥ {$g.refund_money}</td>
							<td>
							   {notempty name="$g.refund"}
								<a href="{:url('refund/refund')}?{:http_build_query(['order_sn'=>$g.order_sn,'goods_id'=>$g.goods_id,'sku_id'=>$g.sku_id,'status'=>$g.refund.status])}">
								 {$g.refund.status_txt} 
								</a>
								￥{$g.refund.refund_money}
								{else /}
							    暂无
							    {/notempty}							
							</td>
                        </tr>
						{/volist}
                    </tbody>
                </table>
				<div class="help-block">注：会员价包含平台补贴，实际结算以本店价为准</div>
            </div>
            <div class="table-title">
                <span class="table-title-icon"></span>
                <span class="table-title-text">收货信息 
				{eq name="$order_info.status" value="1"}
				    <a href="{:url('express/express_add',['order_sn'=>$order_info.order_sn])}" class="label label-danger">直接发货</a>
                    <a href="{:url('express/create_express',['order_sn'=>$order_info.order_sn])}" class="label label-warning">生成发货单</a>
					{lt name="$order_info.order_info.address_edit" value="1"}
				    <a href="{:url('express/address_edit',['order_sn'=>$order_info.order_sn])}" class="label label-info">更改地址</a>
					{/lt}
				{/eq}				
				</span>
            </div>
            <div class="padding-tb">
                <table class="table table-bordered">
                    <tbody>
                        <tr>
                            <th style="width: 150px">收货人</th>
                            <th>收货电话</th>
                            <th>省</th>
                            <th>市</th>
                            <th>区</th>
                            <th>收货地址</th>
                            <th>备注</th>						
                        </tr>
                        <tr>
                            <td>{$order_info.order_info.receiver_name}</td>
                            <td>{$order_info.order_info.receiver_mobile}</td>
                            <td>{$order_info.order_info.province}</td>
                            <td>{$order_info.order_info.city}</td>
                            <td>{$order_info.order_info.district}</td>
                            <td>{$order_info.order_info.receiver_address}</td>
                            <td>{$order_info.order_info.remark}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
			
		  {if condition="$order_info['status'] >=2"}
            <div class="table-title">
                <span class="table-title-icon"></span>
                <span class="table-title-text">发货信息</span>
            </div>
	
            <div class="padding-tb">
                <table class="table table-bordered">
                    <tbody>
                        <tr>
                            <th style="width: 150px">物流公司</th>
                            <th>物流单号</th>
                            <th>发货状态</th>
                            <th style="width: 180px">发货时间</th>
						    <th>备注</th>
                        </tr>
                        {volist name="$order_info.order_express" id="order_express"}
                        <tr>
                            <td>{$order_express.express_company}</td>
                            <td><a href="{:url('express/express_ex',['id'=>$order_express.id,'layer'=>1,'reload'=>1])}" data-toggle="dialog-right">{$order_express.express_no}</a></td>
                            {if condition="$order_express['shipping_time'] > 0"}
                            <td><span class="label label-success">已发货</span></td>
                            {else/}
                            <td><span class="label label-danger">未发货</span></td>
                            {/if}
                            {if condition="$order_express['shipping_time'] > 0"}
                            <td>{$order_express.shipping_time|date="Y-m-d H:i:s"}</td>
                            {else/}
                            <td>无</td>
                            {/if}
                            <td>{$order_express.memo}</td>
                        </tr>
                        {/volist}
                    </tbody>
                </table>
            </div>
			{/if}			
		   
	
		
			<div class="table-title">
                <span class="table-title-icon"></span>
                <span class="table-title-text">结算信息</span>
            </div>
            <div class="padding-tb">			 
                <table class="table table-bordered">
                    <tbody>
                        <tr>
						    <th width="50px">订单总价</th><td class="text-left">￥{$order_info.order_money}</td>                      
                        </tr>	
						<tr>
						    <th width="50px">-运费</th><td class="text-left">￥{$order_info.order_info.express_price}</td>                      
                        </tr>	
						<tr>
						    <th width="50px">-优惠券</th><td class="text-left">￥{$order_info.coupon_money}  </td>                      
                        </tr>	
                       	<tr>
						    <th width="50px">+订单改价</th><td class="text-left">￥{$order_info.edit_money}  </td>                      
                        </tr>							
					
						<tr>
						    <th width="50px">-退款</th><td class="text-left">￥{$order_info.total_refund_money}  </td>                      
                        </tr>	
					
						<tr class="success">
						    <th width="50px" >=应得毛利</th><td class="text-left">￥{$order_info.total_settle_money  ?? 0}  </td>                      
                        </tr>
                        
                       <tr>
						    <th width="50px">-成本价</th><td class="text-left">￥{$order_info.cost_price_total}  </td>                      
                        </tr>	                      
                        	
						<tr class="info">
						    <th width="50px">=应得净利</th><td class="text-left">￥{$order_info.settle_money  ?? 0} <span class="text-danger">（如有退款需入库核验，本利仅做参考）</span> </td>                      
                        </tr>
                        
                       	<tr>
						    <th width="50px">结算状态</th><td class="text-left">
							   {if condition="$order_info['settle_status'] == 1"} 
								 <span class="label label-success">已结算</span> 
                                 <!--
                                 <a href="{:url('store/storemoney/index')}?order_sn={$order_info.order_sn}">查看到账明细</a>
                                 -->
								{else/}
								 <span class="label label-danger">未结算</span>
								{/if}
							
							</td>                      
                        </tr>	
										
                    </tbody>
                </table>				
            </div>
            
             <div class="table-title">
                <span class="table-title-icon"></span>
                <span class="table-title-text">订单操作日志</span>
            </div>
            <div class="padding-tb">
			 
                <table class="table table-bordered">
                    <tbody>
                        <tr>
						    <th width="50px">时间</th>
						    <th width="50px">订单状态</th>
                            <th>动作</th>  
                            <th>操作人</th>  
                            <th>备注</th>
                        </tr>
						{volist name="$order_info.action_list" id="v"}
                        <tr>
						    <td>{$v.create_time}</td>  
						    <td>{$v.order_status}</td>
                            <td>{$v.action}</td>                           
							<td>
                               {gt name="$v.uid" value="0"}
                                管理员 {$v.uid}
                                 {else /}
                                    {$v.user_id >0 ? "用户":"系统自动"}
                               {/gt}
                            </td>                            
                            <td>{$v.remark}</td>      
                        </tr>
						{/volist}
                    </tbody>
                </table>				
            </div>
			
        </div>
		</div>
		</div>
{/block}
{block name="script"}
<script>
function query_order(order_sn){
// 发送ajax请求
	jQuery.get('{:url("query_order")}'+'?order_sn='+order_sn, function(res){
		if (res.code) {
			layer.msg(res.msg+'，此单有效');
		}else{
			layer.msg('查询错误，请到商户中心查询');
		}
	})
}
function edit_money(order_sn){

	layer.open({
		id:1,
        type: 1,
        title:'请输入金额',
        skin:'layui-layer-rim',
        area:['450px', 'auto'],        
        content: '<table class="table">'
                  +'<tr><td>订单金额</td><td><input id="edit_money_text" type="number" class="form-control" placeholder="请输入金额"></td></tr>'
		          +'<tr><td>备注信息</td><td><textarea id="edit_money_remark" class="form-control" placeholder="请输入备注"></textarea></td></tr>'            
                  +'</table>',
        btn:['保存','取消'],
        btn1: function (index,layero) {		  
			var money = $("#edit_money_text").val();
			var remark = $("#edit_money_remark").val();
			if(!money){
				layer.msg("请输入金额");
				return false;
			}
			layer.close(index);
			$.post('{:url("edit_money")}',{order_sn:order_sn,money:money,remark:remark},function(res){
				layer.msg(res.msg);
				if (res.code) {
					window.location.reload()
				}
			})
    	},
        btn2:function (index,layero) {
        	 layer.close(index);
        }
 
	})
}
</script>
{/block}